<script>
export default {
  name: "SelectTransportType"
}
</script>

<script setup>
import { apiTmsEnum } from '@/api/public'
import cache from '@/plugins/cache'

const props = defineProps({
  valueKey: {
    type: String,
    default: 'value'
  },
  labelKey: {
    type: String,
    default: 'label'
  }
})


const optionsList = ref([])

const initOptionsList = async () => {
  const local = cache.local.getJSON('oms_SelectTransportType')
  if (local) {
    optionsList.value = local
    return
  }
  const res = await apiTmsEnum({params: ['transport_type']})
  optionsList.value = res.data.transport_type
  cache.local.setJSON('oms_SelectTransportType', res.data.transport_type)
}

onMounted(() => {
  initOptionsList()
})

defineExpose({
  optionsList
})


</script>

<template>
  <el-select v-bind="$attrs"
             filterable
             clearable
             collapse-tags class="select-wrap">
    <el-option
        v-for="item in optionsList"
        :key="item[valueKey]"
        :label="item[labelKey]"
        :value="item[valueKey]"
    />
  </el-select>
</template>

<style scoped lang="scss">

</style>